<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/layui/css/layui.css"  media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>发起采购</legend>
</fieldset>

<form class="layui-form" action="/purchase/submissionMode" method="post">
    <div class="layui-form-item">

        <div class="layui-inline">
            <label class="layui-form-label">选择模式</label>
            <div class="layui-input-inline">
                <select name="procurementModel" lay-verify="required" lay-search="" >
                    <option value="">直接选择或搜索选择</option>
                    <option
                            value=""
                            th:each="date ,dateState:${procurementModel}"
                            th:value="${date.id}"
                            th:text="${date.name}">

                    </option>

                </select>
            </div>
        </div>
        <br>
        <div class="layui-inline">
        <label class="layui-form-label">选择公司</label>
        <div class="layui-input-inline">
            <select name="product" lay-verify="required" lay-search="">
                <option value="">直接选择或搜索选择</option>
                <option
                        value=""
                        th:each="date ,dateState:${suppilers}"
                        th:value="${date.id}"
                        th:text="${date.name}">

                </option>
            </select>
        </div>
        </div>
        <br>
        <div class="layui-inline">
        <label class="layui-form-label">选择商品</label>
        <div class="layui-input-inline">
            <select name="suppiler" lay-verify="required" lay-search="">
                <option value="">直接选择或搜索选择</option>
                <option
                        value=""
                        th:each="date ,dateState:${products}"
                        th:value="${date.key}"
                        th:text="${date.value}">

                </option>
            </select>
        </div>
        </div>
    </div>



    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
        </div>
    </div>
</form>


<script src="/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');

        //自定义验证规则
        form.verify({
            title: function(value){
                if(value.length < 5){
                    return '标题至少得5个字符啊';
                }
            }
            ,pass: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ]
            ,content: function(value){
                layedit.sync(editIndex);
            }
        });


        //表单赋值
        layui.$('#LAY-component-form-setval').on('click', function(){
            form.val('example', {
                "username": "贤心" // "name": "value"
                ,"password": "123456"
                ,"interest": 1
                ,"like[write]": true //复选框选中状态
                ,"close": true //开关状态
                ,"sex": "女"
                ,"desc": "我爱 layui"
            });
        });

        //表单取值
        layui.$('#LAY-component-form-getval').on('click', function(){
            var data = form.val('example');
            alert(JSON.stringify(data));
        });

    });
</script>

</body>
</html>